// 导出一个 Vuex 模块
export default {
    // 定义模块的状态，用于存储数据
    state: {
        // 购物车商品列表，每个商品包含多个属性
        list: [
            {
                id: 11,
                checked: false, // 商品是否被选中
                cover: '../../static/images/demo/list/1.jpg', // 商品封面图片路径
                title: '商品11', // 商品标题
                skusText: '绿色、标配', // 商品规格描述
                pprice: 100, // 商品单价
                num: 1, // 商品数量
                min: 1, // 商品最小购买数量
                max: 9, // 商品最大购买数量
            },
            {
                id: 12,
                checked: false,
                cover: '../../static/images/demo/list/2.jpg',
                title: '商品12',
                skusText: '黄色、标配',
                pprice: 200,
                num: 2,
                min: 1,
                max: 10,
            },
            {
                id: 13,
                checked: false,
                cover: '../../static/images/demo/list/3.jpg',
                title: '商品13',
                skusText: '绿色、套餐一',
                pprice: 100,
                num: 1,
                min: 1,
                max: 8,
            }
        ],
        // 用于存放选中商品的 id
        selectedAll: []
    },
    // 定义修改状态的方法，必须是同步的
    mutations: {
        // 单选商品，改变商品的选中状态
        selectItem(state, index) {
            // 获取当前商品的 id
            let id = state.list[index].id
            // 如果商品已经被选中
            if (state.list[index].checked) {
                // 将商品的选中状态改为未选中
                state.list[index].checked = false
                // 找到该商品 id 在 selectedAll 数组中的索引
                let i = state.selectedAll.indexOf(id)
                // 从 selectedAll 数组中移除该商品的 id
                state.selectedAll.splice(i, 1)
            } else {
                // 如果商品未被选中，将其选中状态改为选中
                state.list[index].checked = true
                // 将该商品的 id 添加到 selectedAll 数组中
                state.selectedAll.push(id)
            }
            // 打印选中商品的 id 数组，用于调试
            console.log('11111', state.selectedAll);
        },
        // 全选商品
        selectAll(state) {
            // 遍历商品列表，将每个商品的选中状态改为选中
            state.selectedAll = state.list.map((item) => {
                item.checked = true
                // 返回商品的 id
                return item.id
            })
            // 将所有商品的 id 存入 selectedAll 数组
        },
        // 全不选商品
        unselectAll(state) {
            // 遍历商品列表，将每个商品的选中状态改为未选中
            state.list.map((item) => {
                item.checked = false
            })
            // 清空 selectedAll 数组
            state.selectedAll = []
        },
        // 删除选中的商品
        delSelect(state) {
            // 弹出确认删除的模态框
            uni.showModal({
                title: '提示',
                content: '您确定要删除吗',
                success: (res) => {
                    // 如果用户点击了确定
                    if (res.confirm) {
                        console.log('用户点击确定');
                        // 过滤掉被选中的商品，只保留未选中的商品
                        state.list = state.list.filter(item => {
                            return !item.checked;
                        })
                        // 清空 selectedAll 数组
                        state.selectedAll = []
                    } else if (res.cancel) {
                        console.log('用户点击取消');
                    }
                }
            });
        }
    },
    // 定义获取状态的计算属性
    getters: {
        // 判断是否全选
        checkedAll(state) {
            // 如果商品列表的长度等于选中商品的 id 数组的长度，则表示全选
            return state.list.length == state.selectedAll.length
        },
        // 计算选中商品的总价
        totalPrice(state) {
            let total = 0;
            // 遍历商品列表
            state.list.forEach(item => {
                // 如果商品被选中
                if (item.checked) {
                    // 累加商品的总价
                    total += item.pprice * item.num
                }
            })
            return total;
        },
        // 判断购物车是否为空
        isListShow(state) {
            // 如果商品列表的长度为 0，则表示购物车为空
            return state.list.length == 0
        }
    },
    // 定义异步操作或批量操作的方法
    actions: {
        // 全选或全不选商品的操作
        doSelectedAll({ getters, commit }) {
            // 如果已经全选，则执行全不选操作
            // 否则，执行全选操作
            getters.checkedAll ? commit('unselectAll') : commit('selectAll')
        }
    }
}